<template>
  <div>
    <c-table-box ref="cTableBox" hide-func checkbox :other-filters="otherFilters" :table-config="tableConfig" @selection-change="selectionChange">
      <template #btn>
        <c-permission v-if="type==='all'" code="all">
          <c-button type="primary" opt-code="add" @click="addHandle">新增</c-button>
          <c-button type="primary" opt-code="export" @click="exportVisible=true">导出</c-button>
          <c-button type="primary" opt-code="editIsRedesign" @click="openEdit">修改重复设计</c-button>

        </c-permission>
        <c-permission v-if="type==='waitAllot'" code="allot">
          <c-button type="primary" opt-code="allot" @click="allotHandle">分配设计单位</c-button>
          <c-button type="primary" opt-code="allot" @click="exportVisible=true">导出</c-button>
        </c-permission>
        <c-permission v-if="type==='waitHandle'" code="deal">
          <c-button type="primary" opt-code="deal" @click="handleTaskHandle">处理任务</c-button>
          <c-button type="primary" opt-code="export" @click="exportVisible=true">导出</c-button>
        </c-permission>
        <c-permission v-if="type==='waitAudit'" code="audit">
          <c-button type="primary" opt-code="audit" @click="auditHandle">审核</c-button>
          <c-button type="primary" opt-code="export" @click="exportVisible=true">导出</c-button>
        </c-permission>
        <c-permission v-if="type==='termination'" code="termination">
          <c-button type="primary" opt-code="deal" @click="handleTaskHandle">处理任务</c-button>
        </c-permission>
        <c-permission v-if="type==='pending'" code="pending">
          <c-button type="primary" opt-code="audit" @click="auditHandle">审核</c-button>
        </c-permission>
      </template>
    </c-table-box>
    <export-files
      v-if="exportVisible"
      title="导出"
      :config="exportConfig"
      :visible.sync="exportVisible"
      @success="handleExportSuccess"
    />
    <el-dialog
      title="提示"
      :close-on-click-modal="false"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="handleClose"
    >
      是否重复设计：
      <el-select v-model="haveRedesign" clearable placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        />
      </el-select>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="editIsRedesign">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { saveEditData } from '@/api/shopDesignTask'

import { otherFiltersItem } from '@/utils'
export default {
  name: 'List',
  components: {
  },
  props: {
    type: {
      type: String,
      default: ''
    },
    activeType: {
      type: String,
      default: ''
    },
    serachFilters: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      exportVisible: false,
      dialogVisible: false,
      haveRedesign: undefined,
      options: [{ label: '是', value: 1 }, { label: '否', value: 0 }],
      tableConfig: {
        interfacePath: '/slm-admin/api/v1/shopDesignTask/getShopDesignTask/page',
        hideFuncBar: true,
        sort: 'createTime',
        sortersRow: [],
        apiHeader: {
          'Permission-App': 'slm'
        },
        setting: [
          {
            prop: 'designTaskCode',
            label: '任务编号',
            minWidth: 120,
            className: 'btn-green',
            isButton: true,
            clickFun: this.toDetail
          },
          {
            prop: 'taskType',
            label: '任务类型',
            minWidth: 110,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'TASK_TYPE'
            }
          },
          {
            prop: 'haveRedesign',
            label: '是否重复设计',
            minWidth: 130,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'BOOLEANS'
            }
          },
          {
            prop: 'state',
            label: '任务进度',
            minWidth: 120,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'DESIGN_TASK_STATE'
            }
          },
          {
            prop: 'constState',
            label: '门店建设状态',
            minWidth: 150,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'CONST_STATE'
            }
          },
          {
            prop: 'designUnitName',
            label: '设计单位',
            minWidth: 120
          },
          {
            prop: 'constCode',
            label: '门店建设项目号',
            minWidth: 180
          },
          {
            prop: 'shopName',
            label: '所属门店',
            minWidth: 120
          },
          {
            prop: 'clientName',
            label: '所属客户',
            minWidth: 120
          },
          {
            prop: 'officeName',
            label: '所属办事处',
            minWidth: 120
          },
          {
            prop: 'distributeTime',
            label: '任务分配时间',
            minWidth: 140
            // formatData: this.$parseTimeYMD('distributeTime')
          },
          {
            prop: 'shopTotalArea',
            label: '卖场报图总面积',
            minWidth: 140
            // formatData: this.$parseTimeYMD('distributeTime')
          },
          {
            prop: 'doorHeadPicArea',
            label: '门头报图总面积',
            minWidth: 140
          }
        ]
      },
      typeFilters: [],
      selections: []
    }
  },
  computed: {
    otherFilters() {
      return [...this.serachFilters, ...this.typeFilters]
    },
    name() {
      let str = ''
      switch (this.type) {
        case 'all':
          str = '设计任务管理'
          break
        case 'waitAllot':
          str = '设计任务管理待分配'
          break
        case 'waitHandle':
          str = '设计任务管理待处理'
          break
        case 'waitAudit':
          str = '设计任务管理待审核'
          break
      }
      return str
    },
    exportConfig() {
      return [{
        code: 'export',
        name: this.name,
        dataApi: '/slm-admin/api/v1/shopDesignTask/export',
        selectedRows: this.selections,
        paramsRaw: {},
        filtersRaw: this.otherFilters,
        queryField: 'id',
        headers: {
          'Permission-code': 'designtaskmanagement',
          'Permission-App': 'slm'
        }
      }]
    }
  },
  watch: {
    type: {
      handler(v) {
        this.setOtherFilters(v)
      },
      immediate: true
    },
    serachFilters: {
      handler(v) {
        if (this.activeType !== this.type) return
        this.$nextTick(() => {
          this.$refs.cTableBox.initTableData()
        })
      }
    }
  },
  created() {
  },
  activated() {
    if (this.ready && this.refreshTableData) {
      this.refreshTableData()
    }
  },
  deactivated() {
    this.ready = true
  },
  methods: {
    // 设置过滤条件
    setOtherFilters(v) {
      switch (v) {
        case 'all':
          this.typeFilters = []
          break
        case 'waitAllot':
          this.typeFilters = [
            otherFiltersItem('state', 'A', '='),
            otherFiltersItem('isEnd', '0', '=')
          ]
          break
        case 'waitHandle':
          this.typeFilters = [
            otherFiltersItem('state', 'B', '='),
            otherFiltersItem('isEnd', '0', '='),
            otherFiltersItem('constState', 'A', '=')
          ]
          break
        case 'waitAudit':
          this.typeFilters = [
            otherFiltersItem('state', 'C', '='),
            otherFiltersItem('isEnd', '0', '='),
            otherFiltersItem('constState', 'A', '=')
          ]
          break
        case 'termination':
          this.typeFilters = [
            otherFiltersItem('state', 'B', '='),
            otherFiltersItem('taskType', 'END_APPLY', '='),
            otherFiltersItem('constState', 'B', '=')
          ]
          break
        case 'pending':
          this.typeFilters = [
            otherFiltersItem('state', 'C', '='),
            otherFiltersItem('taskType', 'END_APPLY', '='),
            otherFiltersItem('constState', 'B', '=')
          ]
          break
      }
    },
    selectionChange(v) {
      this.selections = v
    },
    refreshTableData(v = 'onPage') {
      this.$nextTick(() => {
        this.$refs.cTableBox.initTableData(v)
      })
    },
    // 新增
    addHandle() {
      this.$router.push({ name: 'ShopDesignTaskAddEdit' })
    },
    handleClose() {
      this.haveRedesign = undefined
      this.dialogVisible = false
    },
    openEdit() {
      if (!this.singleJudge(this.selections, '修改', true)) {
        return
      }
      this.haveRedesign = this.selections[0].haveRedesign ? 0 : 1
      this.dialogVisible = true
    },
    // 修改是否重复设计
    editIsRedesign() {
      const data = {
        id: this.selections[0].id,
        haveRedesign: this.haveRedesign === '' ? null : this.haveRedesign
      }
      saveEditData(data).then(res => {
        if (res.success) {
          this.$message.success(`【是否重复设计】已修改】`)
          this.handleClose()
          this.refreshTableData()
        }
      })
    },
    // 处理任务
    handleTaskHandle() {
      if (!this.singleJudge(this.selections, '处理任务', true)) {
        return
      }
      const d = this.selections[0]
      this.$router.push({ name: 'ShopDesignTaskHandle', query: { id: d.id, taskType: d.taskType, haveRedesign: d.haveRedesign, unitCode: d.designUnitCode }})
    },
    // 分配设计单位
    allotHandle() {
      if (!this.singleJudge(this.selections, '分配设计单位', true)) {
        return
      }
      const d = this.selections[0]
      this.$router.push({ name: 'ShopDesignTaskAllocation', query: { id: d.id }})
    },
    auditHandle() {
      if (!this.singleJudge(this.selections, '审核', true)) {
        return
      }
      const d = this.selections[0]
      this.$router.push({ name: 'ShopDesignTaskAudit', query: { id: d.id }})
    },
    // 详情
    toDetail(row) {
      this.$router.push({ name: 'ShopDesignTaskDetail', query: { id: row.id }})
    }
    // // 导出成功
    // handleExportSuccess() {
    //   this.$message.success('导出成功！')
    // }
  }
}
</script>
<style lang="scss" scoped>
.image{
  width: 48px;
  height: 48px;
}
</style>
